<div>

  <el-table :data="tableData" style="width: 100%">
    <el-table-column type="expand">
      <template slot-scope="scope">
        <!-- 一级分类 -->
        <el-row v-for="(item1, index) in scope.row.children" :key="index" class="row1">
          <el-col :span="4">
            <el-button type="primary" plain size="mini">
              {{ item1.authName }} <i class="el-icon-close"></i>
            </el-button>
          </el-col>
          <el-col :span="20">
            <!-- 二级分类 -->
            <el-row v-for="(item2, index) in item1.children" :key="index" class="row2">
              <el-col :span="4">
                <el-button type="success" plain size="mini">
                  {{ item2.authName }} <i class="el-icon-close"></i>
                </el-button>
              </el-col>
              <el-col :span="20">
                <!-- 三级分类 -->
                <el-button type="warning" plain size="mini" v-for="(item3, index) in item2.children" :key="index">
                  {{ item3.authName }} <i class="el-icon-close"></i>
                </el-button>
              </el-col>
            </el-row>

          </el-col>
        </el-row>
      </template>
    </el-table-column>
    <el-table-column type="index" :index="indexMethod" width='50'></el-table-column>
    <el-table-column prop="roleName" label="角色名称" width="180"></el-table-column>
    <el-table-column prop="roleDesc" label="描述" width="180"></el-table-column>
    <el-table-column label="操作">
      <template slot-scope="scope">
        <el-button type="primary" size='mini' plain icon="el-icon-edit"></el-button>
        <el-button type="danger" size='mini' plain icon="el-icon-delete"></el-button>
        <el-button type="success" size='mini' plain icon='el-icon-check' @click='showDialog(scope.row)'>分配权限
        </el-button>
      </template>
    </el-table-column>
  </el-table>
  <!-- 分配权限 -->
  <el-dialog title="提示" :visible.sync="dialogVisible" width="30%">
    <el-tree :data="tree" ref='tree' show-checkbox node-key="id" :default-expanded-keys="keys"
      :default-checked-keys="keys" :props="defaultProps">
    </el-tree>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" @click="updataAuthority">确 定</el-button>
    </span>
  </el-dialog>
</div>
